<template>
  <el-dialog
    :title="
      $attrs.type === 'refTable'
        ? $t('flyparam.param_config_title_ref', {
            appName: this.appName,
            sn: this.snLabel
          })
        : $t('flyparam.param_config_title', {
            appName: this.appName,
            sn: this.sn
          })
    "
    v-bind="$attrs"
    width="80%"
    :before-close="handleClose"
    v-on="$listeners"
    @open="handleOpen"
  >
    <ParameterEdit
      ref="parameterEdit"
      v-bind="$attrs"
      :app-name="appName"
      :sn="sn"
      @init="loaded"
      @loading="(loading) => (buttonLoading = loading)"
      @save="$emit('save')"
      @close="$emit('update:model-value', false)"
    /><template #footer>
      <div>
        <el-button size="small" @click="handleClose">{{
          $t('common.cancel')
        }}</el-button>
        <el-button
          size="small"
          type="primary"
          :loading="buttonLoading"
          @click="save"
          >{{ $t('common.save') }}</el-button
        >
      </div></template
    >
  </el-dialog>
</template>

<script>
import ParameterEdit from './parameter-edit.vue'
export default {
  name: 'ParamterEditDialog',
  components: {
    ParameterEdit
  },
  inheritAttrs: false,
  props: {
    appName: {
      type: String
    },
    sn: {
      type: String
    },
    snLabel: {
      type: String
    }
  },
  data() {
    return {
      buttonLoading: false
    }
  },
  mounted() {},
  methods: {
    handleOpen() {
      if (this.$refs.parameterEdit) {
        this.$refs.parameterEdit.handleOpen(
          this.$attrs['table-id'],
          this.$attrs['entity-name']
        )
      }
    },
    handleClose() {
      this.$refs.parameterEdit.handleClose()
    },
    save() {
      this.$refs.parameterEdit.save()
    },
    loaded() {
      this.$refs.parameterEdit.handleOpen(
        this.$attrs['table-id'],
        this.$attrs['entity-name']
      )
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-dialog .el-dialog__body {
  padding: 0px;
}

::v-deep .el-dialog__title {
  font-size: 16px;
}
</style>
